//横竖屏
var updateOrientation = function() {
    if (window.orientation == "-90" || window.orientation == "90")
        alert("为了更好的体验，请将手机/平板竖过来！");
};
window.onorientationchange = updateOrientation;

//设置cookie
function setCookie(cookiename, cookievalue, hours) {
    var date = new Date();
    date.setTime(date.getTime() + Number(hours) * 3600 * 1000);
    document.cookie =
        cookiename + "=" + cookievalue + "; path=/;expires = " + date.toGMTString();
}

//获取cookie
function getCookie(cookiename) {
    var preg = new RegExp("(^| )" + cookiename + "=([^;]*)(;|$)", "g");
    if (preg.test(document.cookie)) {
        return RegExp.$2;
    } else {
        return "";
    }
}

//清除cookie
function clearCookie(cookiename) {
    setCookie(cookiename, "", -1);
}

//随机数
function rnd(n, m) {
    return Math.floor(Math.random() * (m - n + 1) + n);
}

//显示提示框
var toast_timer = 0;

function showToast(message) {
    var alert = document.getElementById("toast"),
        toastHTML = "";
    if (alert == null) {
        toastHTML = '<div id="toast">' + message + "</div>";
        document.body.insertAdjacentHTML("beforeEnd", toastHTML);
    } else {
        alert.style.opacity = 0.9;
    }
    toast_timer = setTimeout("hideToast()", 1000);
}

//隐藏提示框
function hideToast() {
    var alert = document.getElementById("toast");
    alert.style.opacity = 0;
    clearTimeout(toast_timer);
}

var $popover = $(".popover"),
    $lottery = $("#lotterys"),
    $go = $("#go"),
    $modal = $(".popover,.modal"),
    $lottery_num = $("#lottery_num"),
    total_num = getCookie("LOTTERY_TOTAL_NUM") || 3;
var canvas = document.getElementById("lotterys"),
    w = (h = 300);
var ctx = canvas.getContext("2d");
var _lottery = {
    title: [], //奖品名称
    colors: [], //奖品区块对应背景颜色
    endColor: "#FF5B5C", //中奖后区块对应背景颜色
    outsideRadius: 140, //外圆的半径
    insideRadius: 30, //内圆的半径
    textRadius: 105, //奖品位置距离圆心的距离
    startAngle: 0, //开始角度
    isLock: false //false:停止; ture:旋转
};

window.onload = function() {
    drawLottery();
};

//画出转盘
function drawLottery(lottery_index) {
    if (canvas.getContext) {
        var arc = Math.PI / (_lottery.title.length / 2); //根据奖品个数计算圆周角度
        ctx.clearRect(0, 0, w, h); //在给定矩形内清空一个矩形
        ctx.strokeStyle = "#e95455"; //strokeStyle 属性设置或返回用于笔触的颜色、渐变或模式
        ctx.font = "16px Microsoft YaHei"; //font 属性设置或返回画布上文本内容的当前字体属性
        for (var i = 0; i < _lottery.title.length; i++) {
            var angle = _lottery.startAngle + i * arc;
            ctx.fillStyle = _lottery.colors[i];

            //创建阴影（两者同时使用） shadowBlur:阴影的模糊级数   shadowColor:阴影颜色 【注：相当耗费资源】
            //ctx.shadowBlur = 1;
            //ctx.shadowColor = "#fff";

            ctx.beginPath();
            //arc(x,y,r,起始角,结束角,绘制方向) 方法创建弧/曲线（用于创建圆或部分圆）
            ctx.arc(w / 2, h / 2, _lottery.outsideRadius, angle, angle + arc, false);
            ctx.arc(w / 2, h / 2, _lottery.insideRadius, angle + arc, angle, true);
            ctx.stroke();
            ctx.fill();
            ctx.save();

            //----绘制奖品开始----
            //中奖后改变背景色
            if (lottery_index != undefined && i == lottery_index) {
                ctx.fillStyle = _lottery.endColor;
                ctx.fill();
            }
            ctx.fillStyle = "#fff";

            var text = _lottery.title[i],
                line_height = 17,
                x,
                y;
            x = w / 2 + Math.cos(angle + arc / 2) * _lottery.textRadius;
            y = h / 2 + Math.sin(angle + arc / 2) * _lottery.textRadius;
            ctx.translate(x, y); //translate方法重新映射画布上的 (0,0) 位置
            ctx.rotate(angle + arc / 2 + Math.PI / 2); //rotate方法旋转当前的绘图
            ctx.fillText(text, -ctx.measureText(text).width / 2, 0); //measureText()方法返回包含一个对象，该对象包含以像素计的指定字体宽度
            ctx.restore(); //把当前画布返回（调整）到上一个save()状态之前
            //----绘制奖品结束----
        }
    }
}

//旋转转盘  angles：角度; item：奖品位置; txt：提示语;
var rotateFn = function(item, angles, txt) {
    _lottery.isLock = !_lottery.isLock;
    $lottery.stopRotate();
    $lottery.rotate({
        angle: 0,
        animateTo: angles + 1800,
        duration: 8000,
        callback: function() {
            setCookie("LOTTERY_TOTAL_NUM", total_num, 24); //记录剩余次数
            $modal.hide();
            drawLottery(item); //中奖后改变背景颜色
            if (item == 3 || item == 7) {
                $popover
                    .show()
                    .find(".m4")
                    .show();
            } else {
                $popover
                    .show()
                    .find(".m5")
                    .show()
                    .find("font")
                    .text(txt);
                record_log(txt); //插入我的中奖纪录
            }
            changeNum(total_num);
            _lottery.isLock = !_lottery.isLock;
        }
    });
};

//开始抽奖
function lottery() {
    if (_lottery.isLock) {
        showToast("请勿重复点击!");
        return;
    }
    $modal.hide();
    if (total_num <= 0) {
        $popover
            .show()
            .find(".m3")
            .show();
        total_num = 0;
    } else {
        var angels = [247, 202, 157, 112, 67, 22, 337, 292]; //对应角度
        drawLottery();
        item = rnd(0, 7);
        rotateFn(item, angels[item], _lottery.title[item]);
        total_num--;
    }
}

//抽奖机会次数
function changeNum(num) {
    $lottery_num.text(num);
}

//写入我的抽奖记录
function record_log(txt) {
    var tpl = "",
        $el = $(".lottery_records");
    tpl =
        txt != undefined ?
        "<li><p>" + txt + "<span>x 1</span></p></li>" :
        '<li class="empty_record"><p>暂无记录</p></li>';
    if ($el.find("li").hasClass("empty_record") > 0) $el.html("");
    $el.append(tpl);
}

//显示微信分享提示
function share_tips() {
    $modal.hide();
    $popover
        .show()
        .find(".m6")
        .show();
}

//关闭弹出层
function close_popover() {
    $popover.hide();
}

$(function() {
    //初始化我的抽奖记录
    record_log();

    //初始化抽奖次数
    changeNum(total_num);

    //动态添加大转盘的奖品与奖品区域背景颜色
    _lottery.title = [
        "奖品一",
        "奖品二",
        "奖品三",
        "谢谢参与",
        "奖品四",
        "奖品五",
        "奖品六 ",
        "谢谢参与"
    ];
    _lottery.colors = [
        "#fe807d",
        "#fe7771",
        "#fe807d",
        "#fe7771",
        "#fe807d",
        "#fe7771",
        "#fe807d",
        "#fe7771"
    ];

    //go 点击事件
    $go.click(function() {
        lottery();
    });

    //领取/分享/再抽一次
    $(".modal_btns").on("click", function() {
        var thisId = $(this).attr("id");
        switch (thisId) {
            case "share_btn":
                share_tips();
                break;
            case "receives_btn":
                window.location.href = "index.html";
                break;
            case "come_again_btn":
                lottery();
                break;
        }
    });

    //我的中奖记录和活动规则
    $(".lottery_btns a").click(function() {
        var theID = $(this).attr("id");
        $modal.hide();
        if (theID == "btn1") {
            $popover
                .show()
                .find(".m2")
                .show();
        } else {
            $popover
                .show()
                .find(".m1")
                .show();
        }
    });

    //关闭弹出层
    $(".modal.m6, .close_btn").click(function() {
        close_popover();
    });
});